<template>
<q-page ref="ScriptPage" :style-fn="handlePageHeight">

    <vxe-grid v-show="script.script_id" ref="ShotTabel" v-bind="gridOptions" @cell-menu="cellContextMenuEvent" @menu-click="contextMenuClickEvent"  @cell-dblclick="cellDblclick">

        <template #scene_default="{ row }">
            {{ row.scene }}
        </template>
        <template #scene_header="{column}">

            <span>{{ column.title }}</span>
            <q-btn size="12px" @click="addScene" flat dense icon="add"></q-btn>

        </template>
        <template #shot_default="{ row }">
            {{ row.shot }}
        </template>
        <template #shot_header="{column}">

            <span>{{ column.title }}</span>
            <q-btn size="12px" flat @click="addShot" dense icon="add"></q-btn>

        </template>
        <template #position_default="{ row }">
            <span v-if="row.position" outline>{{row.position}}</span>
        </template>
        <template #position_edit="{ row }">
            <vxe-input v-model="row.position" type="text"></vxe-input>
        </template>

        <template #narrate_edit="{ row }">
            <vxe-textarea v-model="row.narrate" autosize placeholder="请输入解说/旁白"></vxe-textarea>
        </template>

        <template #desc_edit="{ row }">
            <vxe-textarea v-model="row.desc" placeholder="请输入画面内容"></vxe-textarea>
        </template>

        <template #scale_default="{ row }">
            <span v-if="row.scale.length>0">
                <q-badge v-for="item,index in row.scale" :key="index" class="q-py-xs q-px-sm" color="teal-4">

                    {{ item }}

                </q-badge>
            </span>

        </template>
        <template #scale_edit="{ row }">
            <vxe-select v-model="row.scale" clearable multiple>

                <vxe-optgroup label="远景">
                    <vxe-option value="远" label="远景"></vxe-option>
                </vxe-optgroup>
                <vxe-optgroup label="全景">
                    <vxe-option value="大全" label="大全"></vxe-option>
                    <vxe-option value="中全" label="中全"></vxe-option>
                    <vxe-option value="小全" label="小全"></vxe-option>
                </vxe-optgroup>
                <vxe-optgroup label="中景">
                    <vxe-option value="中" label="中景"></vxe-option>
                </vxe-optgroup>
                <vxe-optgroup label="近景">
                    <vxe-option value="近" label="近景"></vxe-option>
                </vxe-optgroup>

                <vxe-optgroup label="特写">
                    <vxe-option value="特" label="特"></vxe-option>
                    <vxe-option value="大特" label="大特"></vxe-option>
                </vxe-optgroup>

            </vxe-select>
        </template>

        <template #method_default="{ row }">
            <span v-if="row.method.length>0">
                <q-badge v-for="item,index in row.method" :key="index" class="q-py-xs q-px-sm" color="cyan-4">

                    {{ item }}

                </q-badge>
            </span>
        </template>
        <template #method_edit="{ row }">
            <vxe-select v-model="row.method" clearable multiple>
                <vxe-optgroup label="方向">
                    <vxe-option value="上" label="上"></vxe-option>
                    <vxe-option value="下" label="下"></vxe-option>
                    <vxe-option value="左" label="左"></vxe-option>
                    <vxe-option value="右" label="右"></vxe-option>
                    <vxe-option value="升" label="升"></vxe-option>
                    <vxe-option value="降" label="降"></vxe-option>

                </vxe-optgroup>

                <vxe-optgroup label="基础">
                    <vxe-option value="定" label="固定"></vxe-option>
                    <vxe-option value="推" label="推"></vxe-option>
                    <vxe-option value="拉" label="拉"></vxe-option>
                    <vxe-option value="摇" label="摇"></vxe-option>
                    <vxe-option value="移" label="移"></vxe-option>
                    <vxe-option value="跟" label="跟"></vxe-option>
                    <vxe-option value="退" label="退"></vxe-option>
                    <vxe-option value="绕" label="环绕"></vxe-option>

                </vxe-optgroup>
                <vxe-optgroup label="方法">
                    <vxe-option value="航拍" label="航拍"></vxe-option>
                    <vxe-option value="转换焦点" label="转换焦点"></vxe-option>
                    <vxe-option value="希区柯克" label="希区柯克"></vxe-option>
                </vxe-optgroup>

            </vxe-select>
        </template>

        <template #duration_default="{ row }">
            <q-badge outline color="amber-4"> {{ formatDuration(row.duration) }}</q-badge>

        </template>
        <template #duration_edit="{ row }">
            <vxe-input v-model="row.duration" type="number" placeholder="请输入数值"></vxe-input>
        </template>

        <template #effect_default="{ row }">
            <q-badge outline v-if="row.effect=='是'" color="light-green-3"> <span>{{row.effect}} </span></q-badge>
            <q-badge outline v-if="row.effect=='否'" color="green-4"> <span>{{row.effect}} </span></q-badge>

        </template>
        <template #effect_edit="{ row }">
            <vxe-select v-model="row.effect" transfer>
                <vxe-option value="是" label="是"></vxe-option>
                <vxe-option value="否" label="否"></vxe-option>
            </vxe-select>
        </template>

        <template #music_default="{ row }">
            <span>{{row.music}} </span>
        </template>
        <template #music_edit="{ row }">
            <vxe-select v-model="row.sex2" multiple transfer>
                <vxe-option v-for="item in sexList" :key="item.value" :value="item.value" :label="item.label"></vxe-option>
            </vxe-select>
        </template>

        <template #sound_default="{ row }">
            <span>{{row.sound}} </span>
        </template>
        <template #sound_edit="{ row }">
            <vxe-select v-model="row.sex2" multiple transfer>
                <vxe-option v-for="item in sexList" :key="item.value" :value="item.value" :label="item.label"></vxe-option>
            </vxe-select>
        </template>

        <template #refer_default="{ row }">
            {{ row.refer }}
        </template>
        <template #refer_edit="{ row }">
            <vxe-input v-model="row.refer" type="text"></vxe-input>
        </template>

        <template #links_default="{ row }">
            {{ row.links }}
        </template>
        <template #links_edit="{ row }">
            <vxe-input v-model="row.links" type="text"></vxe-input>
        </template>

        <template #memberList_default="{ row }">
            <q-chip clickable dnese class="bg-grey-7 text-teal-2 ellipsis" v-for="i,index in row.memberList" :key="index">

                <q-avatar><img :src="i.avatar"></q-avatar>
                {{ i.name }}
            </q-chip>
            <q-tooltip>
                <div class="column">
                    <span v-for="item,index in row.memberList" :key="index"> {{item.username}}</span>
                </div>
            </q-tooltip>
        </template>
        <template #memberList_edit>

        </template>

        <template #status_default="{ row }">
            <q-badge outline v-if="row.status=='待开始'" color="blue-3"> <span>{{row.status}} </span></q-badge>
            <q-badge outline v-if="row.status=='进行中'" color="pink-3"> <span>{{row.status}} </span></q-badge>
            <q-badge outline v-if="row.status=='已完成'" color="green-3"> <span>{{row.status}} </span></q-badge>
        </template>
        <template #isShot_default="{ row }">
            <span v-if="row.isShot.length>0">
                <q-badge class="q-py-xs q-px-sm" color="cyan-4">

                    {{ row.isShot }}

                </q-badge>
            </span>
        </template>
        <template #isShot_edit="{ row }">
            <vxe-select v-model="row.isShot" clearable transfer>
                <vxe-optgroup label="否">
                    <vxe-option value="否" label="无需拍摄"></vxe-option>
                </vxe-optgroup>

                <vxe-optgroup label="是">
                    <vxe-option value="待拍摄" label="待拍摄"></vxe-option>
                    <vxe-option value="拍摄中" label="拍摄中"></vxe-option>
                    <vxe-option value="已拍摄" label="已拍摄"></vxe-option>

                </vxe-optgroup>

            </vxe-select>
        </template>
        <template #status_edit="{ row }">
            <vxe-select v-model="row.status" transfer>
                <vxe-option value="待开始" label="待开始"></vxe-option>
                <vxe-option value="进行中" label="进行中"></vxe-option>
                <vxe-option value="已完成" label="已完成"></vxe-option>
            </vxe-select>
        </template>

        <template #stime_default="{ row }">
            <span>{{row.stime}} </span>
        </template>
        <template #stime_edit="{ row}">
            <span>{{row.stime}} </span>
            <q-date v-if="row.stime.length==0" class="bg-dark text-white fixed-center z-max" minimal v-model="row.stime" mask="YYYY-MM-DD HH:mm">
            </q-date>

            <q-input dense filled dark v-model="row.stime" lazy-rules :rules="[(val) => (val !== null && val !== '') || '请输入结束时间']" debounce="500">
                <template v-slot:prepend>
                    <q-icon @click.stop="row.stime=''" name="event" class="cursor-pointer">

                        <!-- <q-menu>
                    <vxe-input v-model="row.stime" type="date" placeholder="请选择日期" transfer></vxe-input>
                  </q-menu> -->

                    </q-icon>

                </template>
                <template v-slot:append>
                    <q-icon name="access_time" class="cursor-pointer">
                        <q-popup-proxy transition-show="scale" transition-hide="scale">
                            <q-time dark v-model="row.stime" mask="YYYY-MM-DD HH:mm" format24h>

                                <div class="row items-center justify-end">

                                    <q-btn v-close-popup label="确认" color="primary" flat />
                                </div>
                            </q-time>
                        </q-popup-proxy>
                    </q-icon>
                </template>
            </q-input>
        </template>

        <template #etime_default="{ row }">
            <span>{{row.etime}} </span>
        </template>
        <template #etime_edit="{ row }">
            <span>{{row.etime}} </span>
            <q-date v-if="row.etime.length==0" class="bg-dark text-white fixed-center z-max" minimal v-model="row.etime" mask="YYYY-MM-DD HH:mm">
            </q-date>

            <q-input dense filled dark v-model="row.etime" lazy-rules :rules="[(val) => (val !== null && val !== '') || '请输入结束时间']" debounce="500">
                <template v-slot:prepend>
                    <q-icon @click.stop="row.etime=''" name="event" class="cursor-pointer">

                        <!-- <q-menu>
              <vxe-input v-model="row.stime" type="date" placeholder="请选择日期" transfer></vxe-input>
            </q-menu> -->

                    </q-icon>

                </template>
                <template v-slot:append>
                    <q-icon name="access_time" class="cursor-pointer">
                        <q-popup-proxy transition-show="scale" transition-hide="scale">
                            <q-time dark v-model="row.etime" mask="YYYY-MM-DD HH:mm" format24h>

                                <div class="row items-center justify-end">

                                    <q-btn v-close-popup label="确认" color="primary" flat />
                                </div>
                            </q-time>
                        </q-popup-proxy>
                    </q-icon>
                </template>
            </q-input>
        </template>

        <template #remark_edit="{ row }">
            <vxe-input v-model="row.remark" type="text"></vxe-input>
        </template>

    </vxe-grid>
    <div v-show="!script.script_id" class="fit row flex-center bg-grey-10">
      <q-icon size="80px" name="mdi-script-text-outline"></q-icon>

  </div>
    <taskmember-select ref="memberSelect" :taskMembers="taskMembers" :memberList.sync="selectedTaskMembers" :isMemSeleteDialog="isMemSeleteDialog" @update="memberSelectedRes"></taskmember-select>
    <split-shot :isSplitShotDialog.sync="isSplitShotDialog" :row="curSplitRow"></split-shot>
    <refer-dialog :isReferDialog.sync="isReferDialog"></refer-dialog>

    <q-page-sticky position="bottom-right" :offset="[50,50]">
        <q-fab label="切换视图" vertical-actions-align="left" class="z-max bg-grey-9 shadow-7 text-primary" icon="mdi-swap-horizontal" direction="up" padding="6px">
            <q-fab-action color="primary" @click="handleViewType('timeGridDay')" icon="mdi-table" label="表格视图" />
            <q-fab-action color="cyan-6" @click="handleViewType('timeGridDay')" icon="mdi-video-outline" label="分镜看板" />
            <q-fab-action color="green-6" @click="handleViewType('timeGridDay')" icon="mdi-video-box" label="分场看板" />
            <q-fab-action color="secondary" @click="handleViewType('timeGridWeek')" icon="mdi-calendar-clock" label="计划看板" />
            <q-fab-action color="orange" @click="handleViewType('dayGridMonth')" icon="mdi-list-status" label="状态看板" />
            <q-fab-action color="accent" @click="handleViewType('listMonth')" icon="mdi-account-group-outline" label="成员看板" />
        </q-fab>

    </q-page-sticky>

</q-page>
</template>

<script>
import {
    getSeconds
} from 'src/assets/utils/stodate'
import XEUtils from 'xe-utils'
export default {
    components: {
        TaskmemberSelect: () => import("components/TaskmemberSelect.vue"),
        SplitShot:()=>import('pages/studio/workbench/components/SplitShot.vue'),
        ReferDialog:()=>import('pages/studio/workbench/components/ReferDialog.vue')


    },
    data() {
        return {
            script:{},
            role: '',
            mergeCells: [],
            selectedTaskMembers: [],
            curItem: {},
            taskMembers: [],
            isMemSeleteDialog: false,
            isSplitShotDialog:false,
            isReferDialog:false,
            curSplitRow:{},
            gridOptions: {
                height: 0,
                border: true,

                showOverflow: false,

                scrollY: {
                    enabled: false
                },
                rowConfig: {
                    isCurrent: true,

                },
                editConfig: {
                    // 设置触发编辑为手动模式
                    trigger: 'dblclick',
                    // 设置为整行编辑模式
                    mode: 'cell',
                    showIcon: false,
                    autoClear: true

                },
                mergeCells: [],

                autoResize: true,
                stripe: true,
                columnConfig: {
                    resizable: true,
                    // isCurrent:true
                },
                mouseConfig: {
                    selected: true
                },
                menuConfig: {

                    body: {
                        options: [
                            [{
                                    code: 'copy',
                                    name: '复制',
                                    prefixIcon: 'vxe-icon-copy',
                                    visible: true,
                                    disabled: false
                                },
                                {
                                    code: 'paste',
                                    name: '粘贴',
                                    prefixIcon: 'vxe-icon-paste',
                                    visible: true,
                                    disabled: false
                                },
                                {
                                    code: 'clear',
                                    name: '清除内容',
                                    prefixIcon:'vxe-icon-error-circle',
                                    visible: true,
                                    disabled: false
                                },
                                {
                                    code: 'delete',
                                    name: '删除',
                                    prefixIcon:'vxe-icon-delete',
                                    visible: true,
                                    disabled: false
                                },

                            ],
                            [{
                                    code: 'insert',
                                    name: '插入',
                                    prefixIcon: 'vxe-icon-square-plus',
                                    visible: true,
                                    disabled: false
                                },
                                {
                                    code: 'setNewScene',
                                    name: '设为新场',
                                    prefixIcon: 'vxe-icon-square-plus-square',
                                    visible: true,
                                    disabled: false
                                },{
                                code: 'splitShot',
                                    name: '拆分镜头',
                                    prefixIcon: 'vxe-icon-cut',
                                    visible: true,
                                    disabled: false
                                },
                                {
                                    code: 'setRole',
                                    name: '设置分组',
                                    prefixIcon: 'vxe-icon-edit',
                                    visible: true,
                                    disabled: false
                                }
                            ]
                        ]
                    },

                    visibleMethod: this.visibleMethod
                },
                columns: [{
                        field: 'scene',
                        title: '场号',
                        width: 80,
                        align: 'center',

                        showOverflow: true,
                        slots: {
                            default: 'scene_default',
                            header: 'scene_header'
                        }
                    },
                    {
                        field: 'shot',
                        title: '镜号',
                        width: 80,
                        align: 'center',

                        showOverflow: true,
                        slots: {
                            default: 'shot_default',
                            header: 'shot_header'

                        }
                    },
                    {
                        field: 'position',
                        title: '地点',
                        width: 70,
                        titlePrefix: false,
                        editRender: {},
                        slots: {
                            default: 'position_default',
                            edit: 'position_edit'
                        }
                    },
                    {
                        field: 'narrate',
                        title: '解说/旁白',
                        width: '250',
                        editRender: {
                            autofocus: '.vxe-textarea--inner',

                            Immediate: true
                        },

                        slots: {
                            edit: 'narrate_edit'
                        }
                    },
                    {
                        field: 'desc',
                        title: '画面内容',
                        width: '250',
                        editRender: {
                            autofocus: '.vxe-textarea--inner',

                            Immediate: true
                        },

                        slots: {

                            edit: 'desc_edit'
                        }
                    },
                    {
                        field: 'scale',
                        title: '景别',
                        width: 80,
                        align: 'center',
                        editRender: {
                            autoselect: true
                        },
                        titlePrefix: false,
                        slots: {
                            default: 'scale_default',
                            edit: 'scale_edit'
                        },
                        filters: [{
                                label: '远',
                                value: '远'
                            },
                            {
                                label: '全',
                                value: '全'
                            },
                            {
                                label: '中',
                                value: '中'
                            },
                            {
                                label: '近',
                                value: '近'
                            },
                            {
                                label: '特',
                                value: '特'
                            },
                        ]
                    },
                    {
                        field: 'method',
                        title: '摄法',
                        width: 80,
                        align: 'center',
                        editRender: {
                            autoselect: true
                        },
                        slots: {
                            default: 'method_default',
                            edit: 'method_edit'
                        }
                    },
                    {
                        field: 'duration',
                        title: '时长',
                        width: 70,
                        align: 'center',
                        editRender: {},
                        slots: {
                            default: 'duration_default',
                            edit: 'duration_edit'
                        }
                    },
                    {
                        field: 'effect',
                        title: '特效',
                        width: 70,
                        align: 'center',
                        editRender: {
                            autoselect: true
                        },
                        slots: {
                            default: 'effect_default',
                            edit: 'effect_edit'
                        },
                        filters: [{
                                label: '是',
                                value: '是'
                            },
                            {
                                label: '否',
                                value: '否'
                            },

                        ]
                    },
                    {
                        field: 'music',
                        title: '音乐',
                        width: 50,
                        align: 'center',
                        editRender: {},
                        slots: {
                            default: 'music_default',
                            edit: 'music_edit'
                        }
                    },
                    {
                        field: 'sound',
                        title: '音效',
                        width: 50,
                        align: 'center',
                        editRender: {},
                        slots: {
                            default: 'sound_default',
                            edit: 'sound_edit'
                        }
                    },
                    {
                        field: 'refer',
                        title: '参考画面',
                        width: 250,
                        editRender: {},
                        slots: {
                            default: 'refer_default',
                            edit: 'refer_edit'
                        }
                    },
                    {
                        field: 'links',
                        title: '参考资料',
                        width: 100,
                        editRender: {},
                        slots: {
                            default: 'links_default',
                            edit: 'links_edit'
                        }
                    },
                    {
                        field: 'memberList',
                        title: '参与人',
                        width: 100,
                        editRender: {},
                        slots: {
                            default: 'memberList_default',
                            edit: 'memberList_edit'
                        },
                        filters: [{
                                label: '待开始',
                                value: '待开始'
                            },
                            {
                                label: '进行中',
                                value: '进行中'
                            },
                            {
                                label: '已完成',
                                value: '已完成'
                            },

                        ]
                    },
                    {
                        field: 'status',
                        title: '状态',
                        width: 80,
                        align: 'center',
                        editRender: {
                            autoselect: true
                        },
                        slots: {
                            default: 'status_default',
                            edit: 'status_edit'
                        },
                        filters: [{
                                label: '待开始',
                                value: '待开始'
                            },
                            {
                                label: '进行中',
                                value: '进行中'
                            },
                            {
                                label: '已完成',
                                value: '已完成'
                            },

                        ]
                    },
                    {
                        field: 'isShot',
                        title: '拍摄',
                        width: 80,
                        align: 'center',
                        editRender: {
                            autoselect: true
                        },
                        slots: {
                            default: 'isShot_default',
                            edit: 'isShot_edit'
                        },
                        filters: [{
                                label: '无需拍摄',
                                value: '否'
                            },
                            {
                                label: '待拍摄',
                                value: '待拍摄'
                            },
                            {
                                label: '拍摄中',
                                value: '拍摄中'
                            },
                            {
                                label: '已拍摄',
                                value: '已拍摄'
                            },

                        ]
                    },
                    {
                        field: 'stime',
                        title: '开始时间',
                        width: 150,
                        align: 'center',
                        sortable: true,
                        editRender: {},
                        slots: {
                            default: 'stime_default',
                            edit: 'stime_edit'
                        }
                    },
                    {
                        field: 'etime',
                        title: '结束时间',
                        sortable: true,
                        width: 150,
                        editRender: {},
                        align: 'center',
                        slots: {
                            default: 'etime_default',
                            edit: 'etime_edit'
                        }
                    },
                    {
                        field: 'remark',
                        title: '备注',
                        width: 80,
                        editRender: {},
                        slots: {

                            edit: 'remark_edit'
                        }
                    },

                ],
                data: []
            },
            footerData: [
                ['合计', '', 'xx', '666']
            ],

            menuConfig: {
                header: {
                    options: [
                        [{
                            code: 'exportAll',
                            name: '导出所有.csv',
                            prefixIcon: 'vxe-icon-download',
                            visible: true,
                            disabled: false
                        }]
                    ]
                },
                body: {
                    options: [
                        [{
                                code: 'copy',
                                name: '复制内容',
                                prefixIcon: 'vxe-icon-copy',
                                visible: true,
                                disabled: false
                            },
                            {
                                code: 'clear',
                                name: '清除内容',
                                visible: true,
                                disabled: false
                            },
                            {
                                code: 'reload',
                                name: '刷新表格',
                                visible: true,
                                disabled: false
                            }
                        ],
                        [{
                                code: 'myPrint',
                                name: '打印',
                                prefixIcon: 'vxe-icon-print',
                                visible: true,
                                disabled: false
                            },
                            {
                                code: 'myExport',
                                name: '导出.csv',
                                prefixIcon: 'vxe-icon-download',
                                visible: true,
                                disabled: false
                            }
                        ]
                    ]
                },
                footer: {
                    options: [
                        [{
                            code: 'exportAll',
                            name: '导出所有.csv',
                            prefixIcon: 'vxe-icon-download',
                            visible: true,
                            disabled: false
                        }]
                    ]
                },
                visibleMethod: this.visibleMethod
            },

        }
    },
    created() {

    },
    mounted() {
        this.projectinfo = this.$store.state.projectinfo;

        console.log(this.projectinfo);

        this.user = this.$store.state.user
    },
    beforeDestroy() {

    },
    methods: {
        loadFromDoc() {
            this.gridOptions.data=this.script.content;
        },
        reMergeCell() {
            console.log('remerge', this.mergeCells);
            this.gridOptions.mergeCells = [];

            this.mergeCells.forEach(i => {
                this.gridOptions.mergeCells.push(i)
            })

        },
        addScene() {
            let tabel = this.$refs.ShotTabel;
            let data = tabel.getData();
            if (data.length == 0) {
                var scene = 1
            } else {
                var scene = data[data.length - 1].scene + 1;
            }
            var shot = 1;
            let row = {
                scene: scene,
                shot: shot,
                position: '',
                narrate: '',
                desc: '',
                scale: [],
                method: [],
                duration: '2',
                effect: '否',
                music: '',
                sound: '',

                refer: [],
                links: [],
                memberList: [],
                isShot: '否',
                status: '待开始',
                stime: '',
                etime: '',
                remark: ''
            }
            this.gridOptions.data.push(row)
            this.reMergeCell()
        },

        addShot() {
            let tabel = this.$refs.ShotTabel;
            let data = tabel.getData()
            console.log(data);
            if (data.length == 0) {
                var scene = 1;
                var shot = 1;
            } else {
                var scene = data[data.length - 1].scene;
                var shot = data[data.length - 1].shot + 1;
            }

            let row = {
                scene: scene,
                shot: shot,
                position: '',
                narrate: '',
                desc: '',
                scale: [],
                method: [],
                duration: '2',
                effect: '否',
                music: '',
                sound: '',

                refer: [],
                links: [],
                memberList: [],
                isShot: '否',
                status: '待开始',
                stime: '',
                etime: '',
                remark: ''
            }

            this.gridOptions.data.push(row)

            let rowIndex = data.findIndex(i => i.scene == scene);
            let arr = [];
            data.forEach(i => {
                if (i.scene == scene) {
                    arr.push(i)
                }
            })
            let rowSpan = arr.length + 1;
            console.log(rowIndex, rowSpan);
            if (rowSpan > 1) {
                this.mergeCells.splice(scene - 1, 1, {
                    row: rowIndex,
                    col: 0,
                    rowspan: rowSpan,
                    colspan: 1
                })
                this.gridOptions.mergeCells = this.mergeCells

            }

        },
        handleIcon() {
            console.log('icon click');

        },
        doThis() {
            console.log('dianji date');
        },
        handleStimeInput(v) {
            console.log(v);
        },
        handleViewType() {

        },
        handleTaskMember() {
            this.projectinfo.memberList.forEach(item => {
                item.name = item.username;
            })
            this.taskMembers = this.projectinfo.memberList;
        },
        cellDblclick(item) {
            console.log(item);
            if (item.$columnIndex == 13) {
                this.handleTaskMember()
                this.isMemSeleteDialog = true;

                this.curItem = item
                this.selectedTaskMembers = item.row.memberList;
            }
            if (item.$columnIndex == 11) {

                this.isReferDialog = true;


            }
        },
        memberSelectedRes(msg, data) {
            if (msg == 'close') {
                this.isMemSeleteDialog = false;
            } else {
                this.isMemSeleteDialog = false;
                this.selectedTaskMembers = [];
                console.log(this.curItem, 'confirm');

                this.curItem.data[this.curItem.seq-1].memberList = data;


            }

        },
        formatDuration(row) {
            return getSeconds(row)
        },
        contextMenuClickEvent({ menu, row, column }){
          switch (menu.code) {
                case 'setNewScene':
                   console.log('set new scene');
                   console.log(row,column);
                   let table = this.$refs.ShotTabel;
                   let data = this.$refs.ShotTabel.getTableData().tableData;
                   console.log(data);
                   let seq = table.getRowSeq(row)
                   console.log(seq);
                   let index = seq-1;


                    let newArr = data.slice(index,data.length)
                    var scene = row.scene+1;
                    newArr.forEach((i,index)=>{
                          i.scene = scene;
                          i.shot = index+1;

                    })
                    console.log(this.gridOptions.data);
                  break

                case 'splitShot':
                    console.log('拆分镜头');
                    this.isSplitShotDialog=true;
                    this.curSplitRow=row
                    break
              }
        },

        cellContextMenuEvent({row}) {

            const $grid = this.$refs.ShotTabel
            $grid.setCurrentRow(row)
        },

        handlePageHeight(val, i) {
            console.log(val, i);
            // this.sheetStyle.height = i - val + 'px';
            this.gridOptions.height = i - val;

            return {
                height: i - val + 'px'
            }

        },
        handleCellUpdate(r, c, oldValue, newValue, isRefresh) {
            console.info('cellUpdated', r, c, oldValue, newValue, isRefresh)
            let data = window.luckysheet.getSheetData()

            console.log(data);
        },
    }
}
</script>

<style>

    </style>
